<template>
  <div>
    <Divider>列表</Divider>

    <!-- <sh-table
      ref="ShTableRef"
      title="基础列表"
      :tabs="tabs"
      :formConfigs="formConfigs"
      :columns="columns"
      :data="dataSource"
      :loading="loading"
      :pagination="pagination"
      @register="registerTable"
    >
      <template #toolbtn>
        <button-list :btn-list="toolBtnList" :flex="'flex-start'" />
      </template>
      <template #file="{ row }"> {{ row.filename }} </template>
      <template #action>
        <sh-table-action :actions="actions" />
      </template>
    </sh-table> -->

    <sh-table
      ref="ShTable2Ref"
      title="多选"
      :showPrefix="true"
      :formConfigs="formConfigs"
      :columns="columns"
      :data="dataSource"
      :pagination="pagination"
      @register="registerTable"
    >
      <template #toolbtn>
        <button-list :btn-list="toolBtnList" :flex="'flex-start'" />
      </template>
      <template #file="{ row }"> {{ row.filename }} </template>
      <!-- <template #action>
        <sh-table-action :actions="actions" />
      </template> -->
      <!-- <template #tableOperation>
        <Alert show-icon>
          <span>已选择 1 项，扣款金额总计：xxxx元</span>
          <Button size="small" @click="handleClearselection">清空</Button>
        </Alert>
      </template> -->
    </sh-table>
  </div>
</template>

<script setup>
import { onMounted, reactive, ref, unref } from 'vue';
import { formConfigs, tabs, columns, pagination } from './data/table';

let ShTableRef = ref(null);

let methods = {};

const registerTable = register => {
  // const { setSearchValue, getSearchValue, selectAll } = register;
  methods = register;
};

const handleClearselection = () => {
  methods.selectAll(false);
};

// data
let dataSource = ref([]),
  loading = ref(false);

const actions = [
  {
    label: '编辑',
  },
  {
    label: '查看',
  },
  {
    label: '删除',
    danger: true,
  },
];

const files = {
  category: 'test',
};

const onReset = params => {
  onSearch(params);
};

const onSearch = params => {
  // 表格数据赋值
  if (params.current === 1) {
    dataSource.value = [
      {
        name: '余凝',
        age: 18124124,
        address: '123123123',
        businessTotalAmount: 400000,
        businessTotalDeductedAmount: 100,
        filename: '',
      },
      {
        name: '余凝',
        age: 0,
        address: '123123123',
        businessTotalAmount: 400000,
        businessTotalDeductedAmount: 100,
        filename: '2',
      },
      {
        name: '余凝',
        age: 18,
        address: '123123123',
        businessTotalAmount: 400000,
        businessTotalDeductedAmount: 100,
        filename: '',
      },
      {
        name: '余凝',
        age: 18,
        address: '123123123',
        businessTotalAmount: 400000,
        businessTotalDeductedAmount: 100,
        filename: '2',
      },
      {
        name: '余凝',
        age: 18,
        address: '123123123',
        businessTotalAmount: 400000,
        businessTotalDeductedAmount: 100,
        filename: '2',
      },
      {
        name: '余凝',
        age: 18,
        address: '123123123',
        businessTotalAmount: null,
        businessTotalDeductedAmount: 100,
        filename: '2',
      },
      {
        name: '余凝',
        age: 18,
        address: '123123123',
        businessTotalAmount: 400000,
        businessTotalDeductedAmount: 100,
        filename: '2',
      },
      {
        name: '余凝',
        age: 18,
        address: '123123123',
        filename: '2',
        businessTotalAmount: 0,
      },
      {
        name: '余凝',
        age: 18,
        address: '123123123',
        filename: '2',
        businessTotalAmount: 0,
      },
      {
        name: '余凝',
        age: 18,
        address: '123123123',
        filename: '2',
        businessTotalAmount: 0,
      },
    ];
  } else {
    dataSource.value = [
      {
        name: '余凝',
        age: 18124124,
        address: '123123123',
        filename: '1',
      },
      {
        name: '余凝',
        age: 18,
        address: '123123123',
        filename: '2',
      },
      {
        name: '余凝',
        age: 18,
        address: '123123123',
        filename: '3',
      },
    ];
  }
  // 分页total赋值
  pagination.total = 12;
};

const pageChange = ({ current, total }) => {
  onSearch({ current, total });
};

const pageSizeChange = params => {
  onSearch(params);
};

const selectChange = event => {
  console.log(event, 'event');
};

const tabChange = index => {
  const { current, pageSize } = pagination;
  onSearch({ current, pageSize });
};
// const ShTableRef = ref(null);
onMounted(() => {
  onSearch(pagination);
});

const getFiles = () => {
  console.log(unref(ShTableRef).getSearchValue(), '222');
};

const setFiles = obj => {
  unref(ShTableRef).setSearchValue(obj);
};

const toolBtnList = reactive([
  {
    label: '导出',
  },
  {
    label: '新建',
    type: 'primary',
  },
  {
    label: '获取search值',
    type: 'primary',
    onClick: getFiles,
  },
  {
    label: '设置search值',
    type: 'primary',
    onClick: setFiles.bind({}, files),
  },
]);
</script>
